<style lang="scss" scoped>
.layout{
    width: 100vw;
    height: 100vh;
    background: url('~@/assets/bg.jpg');
    background-size: cover;
}
.header{
    height: 50px;
    line-height: 50px;
    background: rgba($color: #000000, $alpha: .6);
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    .logo{
        width: 38px;
        margin-top: 6px;
        float: left;
    }
    .drag{
        width: calc(100vw - 50px);
        -webkit-user-select: none;
        -webkit-app-region: drag;
    }
}
.container{
    height:calc(100vh - 50px - 20px);
    border-radius: 3px;
    position: fixed;
    width:  calc(100vw - 40px) ;
    left: 0;right: 0;
    margin: auto;
    overflow-y: auto;
    background-color: rgba($color: #000000, $alpha: .85);
}
</style>
<template>
    <div class="index">
        <Layout class="layout">
            <Header class="header d-flex between w-100b px-1 color-fff">
                <div class="drag">
                    <img src="@/assets/logo.png" class="logo mr-1">
                    <h4>陆军军事交通学院</h4>
                </div>
                <div><Icon type="md-close" class="pointer" size="18" @click="close"/></div>
            </Header>
            <Content class="p-2 mt-4">
                <div class="container">
                    <router-view/>
                </div>
            </Content>
        </Layout>
    </div>
</template>

<script>
export default {
    methods:{
        close(){
            this.$Modal.confirm({
                title: '关闭',
                content: '确认关闭吗？',
                onOk: () => {
                    this.$ipcRenderer.send('close')
                },
            });
        }
    },
}
</script>